<!-- 轮播图 -->
<template>
	<view class="banner_all">
		<u-swiper bgColor="#1C1C1C" mode="dot" :list="banner" :height="getSystemHeight"></u-swiper>
		<view class="banner_bottom">
			<view @tap="toSearch()">
				<img style="width: 105rpx;height: 105rpx;" src="/static/home/qualityInquiry.png" alt="质保查询" />
				<text>质保查询</text>
			</view>
			<view @tap="toShopping()">
				<img src="/static/home/filmMall.png" alt="膜品商城" />	
				<text>膜品商城</text>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				shoppingUrl:'https://mopin.gdweilaishijie.com/app/index.php?i=5&c=entry&m=ewei_shopv2&do=mobile',
			}
		},
		props:{
			banner:{
				type: Array,
				default: []
			}
		},
		methods: {
			//膜品商城
			toShopping() {
				uni.navigateToMiniProgram({
					appId: 'wx27db151e67fb155a',
					path: '/pages/index/index',
					//develop开发版；trial体验版；release正式版
					envVersion: 'release', 
					    success(res) {
					      // 打开成功
					      console.log("跳转小程序成功！",res);
					    } 
					})
				// uni.navigateTo({
				// 	url: '/pages/component/url-view?url='+encodeURIComponent(this.shoppingUrl)
				// })
			},
			// 质保查询
			toSearch(){
				// 路径跳转
				uni.navigateTo({
					url: '/pages/search/search'
				})
			}
		},
		computed:{
			// 计算屏幕高度，轮播图需要
			getSystemHeight(){
				let height = 410;
				uni.getSystemInfo({
					success(res) {
						height = res.windowHeight;
					}
				})
				
				return height;
			},
		},
	}
</script>

<style scoped lang="scss">
.banner_all{
	.banner_bottom{
		width: 100%;
		height: 150rpx;
		display: flex;
		align-items: center;
		justify-content: space-around;
		position: absolute;
		margin-top: -200rpx;
		view{
			&:active{
				background-color: rgba(0,0,0,0.1);
				color: #f8f8f8;
			}
			width: 320rpx;
			height: 200rpx;
			background-color: rgba(0,0,0,0.2);
			border-radius: 16rpx 16rpx 16rpx 16rpx;
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			color: #FFFFFF;
			img{
				width: 100rpx;
				height: 100rpx;
			}
			text{
				margin-top: 8rpx;
				font-family: PingFang SC, PingFang SC;
				font-weight: bold;
				font-size: 28rpx;
				line-height: 28rpx;
				font-style: normal;
			}
		}
	}
}

::v-deep .u-swiper-indicator {
	margin-bottom: 258rpx;
}
</style>
